<template>
    <div class="good">
        <img :src="good.pic" alt="">
        <p>￥{{good.price}}</p>
        <button @click.stop="del">删除</button>
    </div>
</template>

<script>
export default {
    name: '',
    props: {
        good: Object
    },
    setup(props, ctx) {
        // console.log(props, ctx);
        function del() {
            ctx.emit('del', props.good._id)
        }
        
        return {
            del
        }
    }
    // vue2的写法
    // data() { 
    //     return {

    //     }
    // },
    // created() {

    // },
    // methods:{
    //     del() {
    //         this.$emit('del', this.good._id)
    //     }
    // },
}
</script>

<style scoped>
img {
width: 100%;
height: auto;}
p {
color: #e23033;}
button {
width: 100%;
height: 40px;
border: none;
border: 1px solid #ccc;
outline: none;
color: #222;}
</style>